"""
@author: Gaoyaoxia
@date: 2021-02-26 11:42:01
"""
<!-- 委员基本信息审核 -->
<template>
  <div class="base-table-box">
    <div class="table-select-group">
      <div class="left">
        <s-select
          placeholder="-界别-"
          :selectOption="member.sectorType"
          v-model="params.strSector"
          style="width: 95px"
        />
        <s-select
          placeholder="-党派-"
          :selectOption="member.factionType"
          v-model="params.strFaction"
          style="width: 95px"
        />
        <s-select
          :selectOption="member.searchType"
          v-model="params.searchType"
          style="width: 100px"
        />
        <a-input
          class="search-input"
          v-model="params.search"
          placeholder="请输入搜索内容"
        />

        <a-button style="margin-left: 16px" type="primary" @click="search"
          >查询</a-button
        >
        <a-button @click="reset" class="btn-reset">重置</a-button>
      </div>
    </div>
    <div class="tab-select-group">
      <ul>
        <li
          class="select-type-item"
          v-for="(tab, index) in tabTypes"
          :key="tab.key"
          :class="{ active: currentIndex == index }"
          @click="changeTab(tab, index)"
        >
          <span>{{ tab.label }} {{ tab.num }}</span>
        </li>
      </ul>
    </div>
    <a-table
      style="margin-top: 10px"
      :pagination="pagination"
      :columns="columns"
      :data-source="tableData"
      :loading="loading"
      :scroll="{ x: '100%', y: '100%' }"
    >
      <span slot="name" slot-scope="text, record">
        <router-link
          class="link-a"
          :to="{
            path: 'detail',
            query: { id: record.id }
          }"
          >{{ text }}</router-link
        >
      </span>
      <template slot="status" slot-scope="text, record">
        {{ record.status | auditStatus }}
      </template>
      <span slot="action" slot-scope="text, record">
        <router-link
          :to="{ path: 'auditlist/auditmember', query: { id: record.id } }"
          >审核</router-link
        >
      </span>
    </a-table>
  </div>
</template>

<script>
import { member } from 'assets/js/select-option-list'
import paging from 'mixins/paging'
const columns = [
  {
    title: '序号',
    dataIndex: 'key',
    width: 100
  },
  {
    title: '姓名',
    dataIndex: 'name',
    width: 120,
    scopedSlots: { customRender: 'name' },
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '性别',
    dataIndex: 'sex',
    width: 100,
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '籍贯',
    dataIndex: 'strJG',
    width: 100,
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '界别',
    dataIndex: 'sector',
    width: 100,
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '党派',
    dataIndex: 'faction',
    width: 100,
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '修改时间',
    dataIndex: 'updatetime',
    align: 'center',
    width: 180,
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '审核状态',
    dataIndex: 'status',
    width: 120,
    scopedSlots: { customRender: 'status' },
    sorter: (a, b) => a.name.length - b.name.length
  },
  {
    title: '操作',
    dataIndex: 'action',
    width: 120,
    scopedSlots: { customRender: 'action' }
  }
]
export default {
  mixins: [paging],
  components: {},
  data() {
    return {
      columns,
      member,
      tabTypes: [
        { key: '', label: '全部', num: '' },
        { key: '0', label: '待审核', num: 1 },
        { key: '1', label: '已通过', num: 0 },
        { key: '2', label: '不通过', num: 0 }
      ],
      currentIndex: 0,
      count: 0,
      params: {
        strSector: '',
        strFaction: '',
        searchType: 'all',
        auditStatus: ''
      }
    }
  },
  computed: {},
  watch: {},
  mounted() {},
  methods: {
    getTableData(params = this.params) {
      console.log('参数：', params)
      // for (let i = 0; i < this.pagination.pageSize; i++) {
      this.tableData.push({
        key: 1,
        id: 'ID01',
        name: '李菲菲',
        sex: '男',
        strJG: '皖',
        sector: '民革',
        faction: '中共',
        updatetime: '2020-07-02 15:33',
        status: 0
      })
      // }
      this.pagination.total = this.tableData.length
    },
    changeTab(tab, index) {
      this.currentIndex = index
      this.params.auditStatus = tab.key
      this.getTableData(this.params) //传入当前选择的tab
    },
    search() {
      console.log('search:', this.params)
    },
    reset() {
      this.form = {}
    }
  },
  created() {}
}
</script>
<style lang='less' scoped>
.base-table-box .table-select-group {
  margin-bottom: 0px;
}
.tab-select-group {
  margin-top: 20px;
  margin-left: 10px;
  ul li {
    float: left;
    font-size: 14px;
    line-height: 20px;
    padding: 10px 15px;
    color: #666666;
    cursor: pointer;
    border-radius: 2px;
    margin-right: 25px;
    span {
      vertical-align: middle;
    }
  }
  .active {
    background-color: #e6f2f9;
    color: #097bc7;
  }
}
</style>